<template>
	<view class="item">
		<view class="bg-white press-down-active" style="margin-bottom: 10px;" @click="selectUser()">
			<view class="Media Media--alignCenter">
				<view class="Grid Grid--center" style="width: 100%;">
					<view class="Grid Grid--center" style="flex: 1;">
						<u--image shape="circle" :src="info.avatar_url" width="45px" height="45px" style="margin-right: 15px;" />
						<view>
							<view style="margin-bottom: 4px;">{{info.nickname}}</view>
							<view class="Grid-cell">{{info.create_time?info.create_time:'暂无日期'}}</view>
						</view>
					</view>
					<view class="Grid Grid--center">
						<!-- <u-button v-if="info.im_user_id" type="warning" shape="circle" @click.native.stop="handleIm()" style="width: 50px; font-size: 12px; height: 32px;border: 1px solid #EB2E29;color: #EB2E29;background-color: #fff;margin-right: 5px;">私信</u-button> -->
						<u-button v-if="info.status == 1 || info.status == 2" type="info" shape="circle" @click.native.stop="handleSetFocus(3)" style="width: 50px; font-size: 12px; height: 32px;padding: 0;border: 1px solid #E5E5E5;color: #999999;">已关注</u-button>
						<u-button v-if="info.status == 3 || info.status == 4" type="info" shape="circle" @click.native.stop="handleSetFocus(1)" style="width: 50px; font-size: 12px; height: 32px;background: linear-gradient(90deg, #FFB34F  0%, #EA2727 100%);color: #fff;">关注</u-button>
					</view>
				</view>
				<!-- Grid--justifyFlexEnd -->
			</view>
			<view v-if="!(info.status == 3)" class="Media-body text-xs" style="padding: 7px 8px;background: #F5F5F5;border-radius: 10px;margin-top: 15px;">
				<!-- <view class="Grid-cell text-right">{{status[info.status]}}</view> -->
				<view class="Grid Grid--center">
					<view  class="Grid Grid--center" style="width: 100%;" @tap.stop.prevent>
						<view style="padding: 0 5px;flex: 1;">
							<view>开启推送</view>
							<view>新文章/新视频/新动态等</view>
						</view>
						<switch :disabled="info.status == 3" :checked="info.is_push ? true : false" color="#eb2e29" style="transform:scale(0.7); margin-right: -12px;" @change="(e) => {
							info.is_push = e.detail.value ? 1 : 0
							handleSetPush()
						}" />
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		parseQuery
	} from '@/utils/index.js'
	
	const {
		appid
	} = parseQuery()
	
	export default {
		name: 'item',
		props: {
			info: {
				type: Object,
				default: () => ({})
			}
		},
		computed: {

		},
		data() {
			return {
				isPushMap: {
					0: '关闭推送',
					1: '开启推送'
				},
				status: {
					1: '已关注',
					2: '已关注',
					3: '未关注',
					4: '未关注'
				},
				statusMap: {
					1: '关注',
					3: '取消关注'
				}
			}
		},
		methods: {
			selectUser() {
				let http = `${window.location.origin}/user/#/?appid=${appid}&user_id=${this.info.user_id}&other=${new Date().getTime()}`
				window.location.href = http
			},
			handleIm() {
				const conversationID = `C2C${this.info.im_user_id}`;
				uni.navigateTo({ url: `/TUIKit/components/TUIChat/index?appid=${appid}&key=pc&conversationID=${conversationID}&nickname=${this.info.nickname}`});
			},
			handleSetFocus(status) {
				uni.showModal({
					content: `确认${this.statusMap[status]}该分析师?`,
					success: (res) => {
						if (res.confirm) {
							this.$emit('handleSetFocus', {
								user_id: this.info.user_id,
								is_push: status == 3 ? 0 : 1,
								status
							})
						} else if (res.cancel) {}
					}
				});
			},
			handleSetPush() {
				this.$emit('handleSetFocus', {
					user_id: this.info.user_id,
					is_push: this.info.is_push,
					status: this.info.status
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.item {
		padding: 0 15px;
		.bg-white{
			padding: 15px 12px !important;
			border-radius: 10px !important;
			background: #FFFFFF;
		}
	}
</style>